import React, { Component } from 'react';
import * as moment from 'moment';
import { Row, Col, Card } from 'antd';
import './detailhead.scss'

class DetailHead extends Component {
  render() {
    const { dataSource, onClose } = this.props;
    return (
      <React.Fragment>
        <Card className="detail-head">
          <Row type="flex" justify="space-between">
            <Col span={22}>
              <Row type="flex" justify="start" className="detail-row">
                <Col><div className="courier-img" span={2}><img src={dataSource.expressLogo} /></div></Col>
                <Col><span>运单号：<span>{dataSource.waybillNo}</span></span></Col>
                <Col><span>寄件时间：<span>{moment(dataSource.senderTime).utcOffset(-360).format('YYYY-MM-DD HH:mm:ss')}</span></span></Col>
                <Col><span>寄件人：<span>{dataSource.senderName}  {dataSource.senderTel}</span></span></Col>
                <Col><span>收件人：<span>{dataSource.receiverName}  {dataSource.receiverTel}</span></span></Col>
              </Row>
            </Col>
            <Col className="text-right color-primary"><span className="span-back" onClick={onClose}>返回</span></Col>
          </Row>
        </Card>
      </React.Fragment>
    );
  }
};

export default DetailHead;
